

  <div class="layui-fluid">   
    <div class="layui-card">
    
      <div class="layui-card-body">
        <div style="padding: 10px 0">
          <button class="layui-btn layuiadmin-btn-useradmin" id="roleDel">删除选中</button>
          <button class="layui-btn layuiadmin-btn-useradmin" id="roleAdd">添加角色</button>
      </div>
     

    <table id="role" lay-filter="role"></table>  

    </div>
  </div>

<script>
layui.use(['laydate','table','form'], function(){
  var $ = layui.jquery;
  var form = layui.form;
  var table = layui.table;

  table.render({
    elem: '#role'
    ,title:"会员表"
    ,url:'/manager/member/roleList'
    ,cellMinWidth: 80
    ,cols: [[
      {type:'checkbox'}
      ,{field:'id', title: 'ID',width:80, sort: true}
      ,{field:'name',width:120, title: '角色名'}
      ,{field:'optons', width:170,title: '操作',templet:function(){
        return '<div class="layui-btn-container"><button class="layui-btn layuiadmin-btn-useradmin layui-btn-sm layui-icon layui-icon-edit layui-btn-normal" lay-event="edit"> 修改</button><button class="layui-btn layui-btn-sm layui-btn-danger layui-icon layui-icon-delete" lay-event="del"> 删除</button></div>';
      }}
    ]]
    ,page: true
    ,response:{
      statusCode: 200
    }
  });



  $("#roleAdd").on("click",()=>{
    layer.open({
      type: 2
      ,title: "添加角色"
      ,content: '/manager/member/roleAdd'
      ,maxmin: true
      ,area: ['760px', '80%']
      ,btn: ['确定', '取消']
      ,yes: function(index, layero){  
        //提交代码区
        var body = layer.getChildFrame('body', index);
        let name = $(body).find('.title').val();
        $.post("/manager/member/roleAddTo",{
            name: name
          },(res)=>{
        console.log(res);
        table.reload('test'); //数据刷新
        layer.close(index); //关闭弹层
        })
      }
    }); 
  })

//监听工具条
table.on('tool(role)', function(obj){ // lay-filter="对应的值"
  var data = obj.data; //获得当前行数据
  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
  var tr = obj.tr; //获得当前行 tr 的DOM对象
  

  if(layEvent == 'edit'){ //编辑
    layer.open({
      type: 2
      ,title: "修改角色"
      ,content: '/manager/member/roleEdit?name=' + data.name
      ,maxmin: true
      ,area: ['760px', '80%']
      ,btn: ['确定', '取消']
      ,yes: function(index, layero){  
     
        //提交代码区
        var body = layer.getChildFrame('body', index);
        let name = $(body).find('.title').val();
        $.post("/manager/member/roleEditTo",{
            id: data.id,
            name: name
          },(res)=>{
            console.log(res);
            obj.update({
              name: name
            });
           // table.reload('role'); //数据刷新
            layer.close(index); //关闭弹层
        })
      }
    }); 
  }else if(layEvent == 'del'){
    layer.confirm('真的删除行么', function(index){
        layer.close(index);
        
        //向服务端发送删除指令
        $.get('/manager/member/roleDel?id=' + data.id,res => {
          if(res.data > 0) return obj.del();
          layer.msg('错误：请重新删除！', {icon: 5}); 
        })
      });
  }

});




});
</script>

<style>
  .layui-table-cell{height: auto  !important;}
</style>
